<%--
  Created by IntelliJ IDEA.
  User: a0112
  Date: 2022/4/5
  Time: 12:54
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <!-- 必须的 meta 标签 -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <title>用户列表</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.min.css">
    <script src="${pageContext.request.contextPath}/js/jquery-3.5.1.min.js"></script>
    <script src="${pageContext.request.contextPath}/js/bootstrap.bundle.min.js"></script>
    <script>
        $(function (){
            changePage(1)
        })
        function change(obj){
            changePage($(obj).text())
        }
        function changePage(page){
            $.ajax({
                type:"GET",
                url:"${pageContext.request.contextPath}/UserController/Users/pages/"+page+"",
                contentType: "application/json",
                dataType: "json",
                success:function (data) {
                    let str = ""
                    for(var i in data.data.list){
                        str+='<tr>'
                            +'<td>'+data.data.list[i].id+'</td>'
                            +'<td>'+data.data.list[i].username+'</td>'
                            +'<td>'+data.data.list[i].password+'</td>'
                            +'<td>'+data.data.list[i].email+'</td>'
                            +'<td>'+data.data.list[i].status+'</td>'
                            +'<td>'+data.data.list[i].headimg+'</td>'
                            +'<td>'+data.data.list[i].code+'</td>'
                            +'<td>'+data.data.list[i].phonenumber+'</td>'
                            +'<tr>'
                    }
                    $("#userlist").html(str)
                    let strpage = ""
                    for(i = 1; i <= data.data.pages; i++){
                        strpage += '<li class="page-item"><a class="page-link" onClick="change(this)">'+i+'</a></li>'
                    }
                    $("#pageindex").html(strpage)
                }
            })
        }
    </script>
</head>
<body>
成功登录，用户列表是
<table>
    <thead>
        <tr>
            <td>id</td>
            <td>用户名</td>
            <td>密码</td>
            <td>邮箱</td>
            <td>账号状态</td>
            <td>头像路径</td>
            <td>激活码</td>
            <td>电话号码</td>
        </tr>
    </thead>
    <tbody id="userlist">

    </tbody>
</table>
<nav aria-label="Page navigation example">
    <ul id="pageindex" class="pagination">
    </ul>
</nav>
</body>
</html>
